<div class="es-piece">
  <div class="piece-header">{{ 'course.introduction.authentication_certificate'|trans }}</div>
  <div class="piece-body p-lg">
    <ul class="certificates-list">
      {% for certificate in certificates if certificates %}
      <li class="certificates-item clearfix">
        <div class="certificate-img">
          <span>{{ 'course.catalogue.certificate'|trans }}</span>
        </div>
        <div class="certificate-info pull-left">
          <div>
            <span class="certificate-name">{% if certificate.name|length > 34 %}{{ certificate.name|slice(0,34) ~ '...' }}{% else %}{{ certificate.name }}{% endif %}</span>
            {% if obtained[certificate.id]|default(false) %}
              <div class="certificate-obtain-tag certificate-tag-have">{{ 'course.catalogue.certificate_have'|trans }}</div>
            {% else %}
              <div class="certificate-obtain-tag certificate-tag-wait">{{ 'course.catalogue.certificate_wait'|trans }}</div>
            {% endif %}
          </div>
          <div>
            <span class="certificate-description">{{ 'course.catalogue.certificate_obtain'|trans }}</span>
          </div>
        </div>
        <div class="certificate-view-btn pull-right">
          <a class="cd-btn cd-btn-primary" href="#" data-target="#modal" data-toggle="modal" data-url="{{ path('certificate_detail', {id:certificate.id}) }}">{{ 'course.catalogue.certificate_detail'|trans }}</a>
        </div>
      </li>
      {% endfor %}
    </ul>
  </div>
</div>

</section>

